<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <div th:insert="commen/head :: header">
    </div>
    <link rel="stylesheet" th:href="@{/css/reset.css}">
    <link rel="stylesheet" th:href="@{/css/iconfont/iconfont.css}">
    <link rel="stylesheet" th:href="@{/css/Sign-in.css}">
    <script th:src="@{/css/new-iconfont/icon-time/iconfont.js}"></script>
    <script th:src="@{/css/new-iconfont/icon-succeed/iconfont.js}"></script>
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
</head>
<body  style="background-color: rgb(242,244,247)">
<div th:insert="commen/navigationBar :: topNavBar"></div>

    <div class="container-fluid">
        <div class="row">
            <div class="col-md-2">
                <div th:insert="commen/navigationBar :: leafStuNavBar"></div>
            </div>
            <div class="col-md-10">
                <div class="background">
                    <div class="warp">
                        <!--签到信息开始-->
                        <div class="white-nav">
                            <div th:if="${su.getSingIn().getSingInStatus() == 2}" class="logo" style="float: left; margin-top: 35px; margin-left: 40px;">
                                <img th:src="@{../img/cantSingIn.jpg}" width="60" height="60" alt="">
                            </div>
                            <div th:if="${su.getSingIn().getSingInStatus() == 1}" class="logo" style="float:left; margin-top: 35px; margin-left: 40px;">
                                <img th:src="@{../img/singedIn.jpg}" width="60" height="60" alt="">
                            </div>
                            <div class="sign-in-text">
                                <ul class="times">
                                    <li>&nbsp</li>
                                    <li><p th:text="${su.getSingIn().getSName()}"></p></li>
                                </ul>
                                <ul class="time">
                                    <li><p th:text="${su.getSingIn().getAddTime()}">06-01&nbsp;12:25</p></li>
                                    <li>
                                        <svg class="icon1" aria-hidden="true">
                                            <use xlink:href="#icon-shijian"></use>
                                        </svg>
                                    </li>
                                    <li>
                                        <p th:if="${su.getSingIn().getSingInStatus() == 2}">已结束</p>
                                        <p th:if="${su.getSingIn().getSingInStatus() == 1}">进行中</p>
                                    </li>
                                </ul>
                            </div>
                            <div>
                                <div class="left" th:if="${su.getStuSingInStatus().toString() != '1' && su.getSingIn().getSingInCode() == null}">
                                    <a th:if="${su.getSingIn().getSingInStatus() != 2}" class="btn btn-primary" th:href="@{'/studentSingIn/' + ${su.getSId()}}">点击签到</a>
                                </div>
                                <div th:if="${su.getSingIn().getSingInCode() != null && su.getStuSingInStatus().toString() != '1'}">
                                    <button  style="margin-right: 880px; margin-top: 5px;" class="btn btn-primary" data-toggle="modal" data-target="#stuCodeSingIn" role="button">点击签到</button>
                                </div>
                            </div>
                        </div>
                        <!--签到信息结束-->
                        <!--签到状态开始-->
                        <div class="signin-state"  th:if="${su.getStuSingInStatus().toString() == '1'}">
                            <div class="signin-state-detel">
                                <ul>
                                    <li>
                                        <svg class="icon" aria-hidden="true">
                                            <use xlink:href="#icon-chenggong"></use>
                                        </svg>
                                    </li>
                                    <li>
                                        <h2 class="text" >签到成功！</h2>
                                    </li>
                                    <li><p th:text="${su.getSingInTime()}">06-01&nbsp;11:56</p></li>
                                </ul>
                            </div>
                        </div>
                        <div class="signin-state"  th:if="${su.getStuSingInStatus().toString() == '0'}">
                            <div class="signin-state-detel">
                                <ul>
                                    <li>
                                        <!--                            <svg class="icon" aria-hidden="true">-->
                                        <!--                                <use xlink:href="#icon-chenggong"></use>-->
                                        <!--                            </svg>-->
                                    </li>
                                    <li th:if="${su.getSingIn().getSingInStatus() == 2}">
                                        <h2 style="color: #7a7a7a" class="text" >签到已过时！</h2>
                                        <span th:text="${su.getSingInTime()}"></span>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <!--签到状态结束-->
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--签到模态框-->
    <div class="modal fade" id="stuCodeSingIn">
        <div class="modal-dialog">
            <div class="modal-content">
                <!-- 模态框头部 -->
                <div class="modal-header">
                    <h4 class="modal-title">新建签到</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <!-- 模态框主体 -->
                <div class="modal-body">
                    <form th:action="@{/codeSingIn}" method="post">
                        <input type="hidden" name="sId" th:value="${su.getSId()}">
                        <input type="hidden" name="userId" th:value="${session.user.getUserId()}">
                        <input type="hidden" name="courseId" th:value="${session.course.getCourseId()}">
                        <input type="text" name="singInCode" placeholder="请输入签到码"><br>
                        <input type="submit" value="提交">
                    </form>
                </div>
            </div>
        </div>
    </div>
</body>
</html>